<template>
    <div>
        <Row :gutter="24">
            <Col :xl="6" :lg="6" :md="0" :sm="0" :xs="0">
                <Card shadow icon="md-options" :padding="0">
                    <CellGroup @on-click="handleChangeCell" class="ivu-pt-8 ivu-pb-8">
                        <Cell :title="lang.characterTitle" name="string" :label="lang.characterDesc" :selected="currentType === 'string'" />
                        <Cell :title="lang.integerTitle" name="integer" :label="lang.integerDesc" :selected="currentType === 'integer'" />
                        <Cell :title="lang.doubleTitle" name="double" :label="lang.doubleDesc" :selected="currentType === 'double'" />
                        <Cell :title="lang.booleanTitle" name="boolean" :label="lang.booleanDesc" :selected="currentType === 'boolean'" />
                        <Cell :title="lang.datetimeTitle" name="datetime" :label="lang.datetimeDesc" :selected="currentType === 'datetime'" />
                        <Cell :title="lang.nonQueryTitle" name="values" :label="lang.nonQueryDesc" :selected="currentType === 'values'" />
                    </CellGroup>
                </Card>
            </Col>
            <Col :xl="18" :lg="18" :md="24" :sm="24" :xs="24">
                <Card :bordered="false" dis-hover>
                    <Row>
                        <Col :xl="0" :lg="0" :md="24" :sm="24" :xs="24">
                            <Tabs :value="currentType" @on-click="handleChangeCell">
                                <TabPane :label="lang.characterTitle" name="string" />
                                <TabPane :label="lang.integerTitle" name="integer" />
                                <TabPane :label="lang.doubleTitle" name="double" />
                                <TabPane :label="lang.booleanTitle" name="boolean" />
                                <TabPane :label="lang.datetimeTitle" name="datetime" />
                                <TabPane :label="lang.nonQueryTitle" name="values" />
                            </Tabs>
                        </Col>
                    </Row>
                    <featuresEdit ref="_sf" v-if="currentType === 'string'" @resetFeatures="resetFeatures" :features="s_features" :prefix="'sf_'"/>
                    <featuresEdit ref="_if" v-if="currentType === 'integer'" @resetFeatures="resetFeatures"  :features="i_features" :prefix="'if_'"/>
                    <featuresEdit ref="_df" v-if="currentType === 'double'" @resetFeatures="resetFeatures"  :features="d_features" :prefix="'df_'"/>
                    <featuresEdit ref="_bf" v-if="currentType === 'boolean'" @resetFeatures="resetFeatures"  :features="b_features" :prefix="'bf_'"/>
                    <featuresEdit ref="_tf" v-if="currentType === 'datetime'" @resetFeatures="resetFeatures"  :features="t_features" :prefix="'tf_'"/>
                    <modelValues  ref="_mv" v-if="currentType === 'values'"  :values="modelData.values"/>
                </Card>
            </Col>
        </Row>
    </div>
</template>

<script>
import featuresEdit from './features-edit'
import modelValues from './values'
import {cloneDeep} from "lodash";
export default {
    name: "model-features",
    components: {featuresEdit,modelValues },
    data () {
        return {
            currentType: 'string',
            configId:null,
            s_features:[],
            i_features:[],
            d_features:[],
            b_features:[],
            t_features:[],
        }
    },
    props: {
        modelData: {
            default: () => {
                return {}
            }
        },
    },
    computed: {
        lang() {
            return {
                "en-US": {
                    characterTitle: 'Character query property',
                    characterDesc: 'Only 10 Character query properties',
                    integerTitle: 'Integer query property',
                    integerDesc: 'Only 10 Integer query properties',
                    doubleTitle: 'Double query property',
                    doubleDesc: 'Only 10 Double query properties',
                    booleanTitle: 'Boolean query property',
                    booleanDesc: 'Only 10 Boolean query properties',
                    datetimeTitle: 'Datetime query property',
                    datetimeDesc: 'Only 10 Datetime query properties',
                    nonQueryTitle: 'Non query property',
                    nonQueryDesc: 'Non query properties',
                },
                "zh-CN": {
                    characterTitle: '字符查询属性',
                    characterDesc: '可配置10个字符查询属性',
                    integerTitle: '整型查询属性',
                    integerDesc: '可配置10个整型查询属性',
                    doubleTitle: '浮点型查询属性',
                    doubleDesc: '可配置10个浮点型查询属性',
                    booleanTitle: '布尔型查询属性',
                    booleanDesc: '可配置10个布尔型查询属性',
                    datetimeTitle: '时间型查询属性',
                    datetimeDesc: '可配置10个时间型查询属性',
                    nonQueryTitle: '非查询属性',
                    nonQueryDesc: '可配置若干个非查询属性',
                },
            }[this.G_Locale]
        },
    },
    mounted() {
        this.init();
    },
    methods:{
        init(){
            for (let i = 0; i < 10; i++) {
                let s_feature = this.modelData.features.find(f=>f.fieldCode==='s'+i);
                let i_feature = this.modelData.features.find(f=>f.fieldCode==='i'+i);
                let d_feature = this.modelData.features.find(f=>f.fieldCode==='d'+i);
                let b_feature = this.modelData.features.find(f=>f.fieldCode==='b'+i);
                let t_feature = this.modelData.features.find(f=>f.fieldCode==='t'+i);
                if(s_feature){
                    s_feature.fieldName=s_feature.fieldName.replace('sf_','');
                    this.s_features.push(s_feature);
                }else{
                    this.s_features.push({fieldCode: 's'+i, fieldName: "", fieldType:"String",defaultValue: "", comments: ""})
                }
                if(i_feature){
                    i_feature.fieldName=i_feature.fieldName.replace('if_','');
                    this.i_features.push(i_feature);
                }else{
                    this.i_features.push({fieldCode: 'i'+i, fieldName: "",fieldType:"Integer",defaultValue: "", comments: ""})
                }

                if(d_feature){
                    d_feature.fieldName=d_feature.fieldName.replace('df_','');
                    this.d_features.push(d_feature);
                }else{
                    this.d_features.push({fieldCode: 'd'+i, fieldName: "",fieldType:"Double",defaultValue: "", comments: ""})
                }
                if(b_feature){
                    b_feature.fieldName=b_feature.fieldName.replace('bf_','');
                    this.b_features.push(b_feature);
                }else{
                    this.b_features.push({fieldCode: 'b'+i, fieldName: "",fieldType:"Boolean",defaultValue: "", comments: ""})
                }
                if(t_feature){
                    t_feature.fieldName=t_feature.fieldName.replace('tf_','');
                    this.t_features.push(t_feature);
                }else{
                    this.t_features.push({fieldCode: 't'+i, fieldName: "",fieldType:"DateTime",defaultValue: "", comments: ""})
                }
            }
        },
        resetFeatures(prefix) {
            let ch = prefix.substring(0,1);
            let features = []
            for (let i = 0; i < 10; i++) {
                let feature = this.modelData.features.find(f=>f.fieldCode===ch+i);
                if(feature){
                    feature.fieldName=feature.fieldName.replace(prefix,'');
                    features.push(feature);
                }else{
                    features.push({fieldCode: ch+i, fieldName: "",defaultValue: "", comments: ""})
                }
            }
            switch (prefix) {
                case 'sf_':
                    this.s_features = cloneDeep(features);
                    break;
                case 'if_':
                    this.i_features = cloneDeep(features);
                    break;
                case 'df_':
                    this.d_features = cloneDeep(features);
                    break;
                case 'bf_':
                    this.b_features = cloneDeep(features);
                    break;
                case 'tf_':
                    this.t_features = cloneDeep(features);
                    break;
            }
        },
        getFeatures(){
            let features=[];
            let s_features_new = this.s_features.filter(f=>f.fieldName && f.fieldName.trim()!=="");
            s_features_new.map(m=>{
                m.fieldName='sf_'+m.fieldName;
            })
            let i_features_new = this.i_features.filter(f=>f.fieldName && f.fieldName.trim()!=="");
            i_features_new.map(m=>{
                m.fieldName='if_'+m.fieldName;
            })
            let d_features_new = this.d_features.filter(f=>f.fieldName && f.fieldName.trim()!=="");
            d_features_new.map(m=>{
                m.fieldName='df_'+m.fieldName;
            })
            let b_features_new = this.b_features.filter(f=>f.fieldName && f.fieldName.trim()!=="");
            b_features_new.map(m=>{
                m.fieldName='bf_'+m.fieldName;
            })
            let t_features_new = this.t_features.filter(f=>f.fieldName && f.fieldName.trim()!=="");
            t_features_new.map(m=>{
                m.fieldName='tf_'+m.fieldName;
            })
            features.push(...s_features_new,...i_features_new,...d_features_new,...b_features_new,...t_features_new);
            return features;
        },
        getValues(){
          return this.modelData.values;
        },
        handleChangeCell (name) {
            this.currentType = name;
        },
    }
}
</script>
